<template>
  <a-modal v-model="visible"   title="查看信访件" :width="1400"  @cancel='cancel' @ok='sure'>
    <div class="table-page-search-wrapper">
      <a-form layout="inline">
        <a-row :gutter="24">
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
              <a-button type="primary" @click="selectAll()" icon="database">全选</a-button>
              <a-button type="primary" @click="selectNot()" icon="hdd" style="margin-left: 8px">选择未删选选项</a-button>
            </span>
          </a-col>
        </a-row>
      </a-form>
    </div>
    <a-spin :spinning='loading' tip=" 正在加载数据，请耐心等待">
    <a-table
      ref="table"
      :rowKey="record => record.xfjbh"
      :row-selection="rowSelection"
      size="middle"
      bordered
      :columns="columns"
      :scroll={y:400}
      :dataSource="dataSource"
      :pagination="false"
      @change="handleTableChange">
      <span slot='status' slot-scope='text, record,index'>
          <span v-if="record.status==1">已选</span>
          <span v-else>未选</span>
      </span>
    </a-table>
    </a-spin>
  </a-modal>

</template>

<script>
import EpaSortService from '@/myService/EpaSortService'
export default {
  name: 'XfjStatisticsModal',
  data() {
    return {
      data:{
        sortXfjEntities:[]
      },
      visible:false,
      loading: true,
      timeValue: undefined,
      dataSource: [],
      queryParam: {
        startDate: '',
        endDate: ''
      },
      columns: [
        {
          title: '#',
          dataIndex: '',
          key: 'rowIndex',
          width: 60,
          align: "center",
          customRender: (text, row, index) => 1 + index
        },
        {
          title: '信访件编号',
          align: "center",
          width: 200,
          dataIndex: 'xfjbh'
        },
        {
          title: '登记时间',
          align: "center",
          dataIndex: 'djsj',
          width: 140,
          customRender: function (text) {
            return !text ? "" : (text.length > 10 ? text.substr(0, 10) : text)
          }
        },
        {
          title: '去向单位',
          align: "center",
          width: 200,
          dataIndex: 'dwmc'
        },
        {
          title: '信访人姓名',
          align: "center",
          width: 120,
          dataIndex: 'contactName'
        },
        {
          title:'信访内容',
          dataIndex: 'content',
        },
        {
          title: '状态',
          key: 'status',
          width: 60,
          align: 'center',
          scopedSlots: { customRender: 'status' }
        },
      ],
      startDate:'',
      endDate:'',
      item:{},
      selectedRowKeys:[],
      selectedRows:[],
    }
  },
  computed: {
    rowSelection() {
      return {
        onChange: (selectedRowKeys, selectedRows) => {
          console.log(selectedRowKeys);
          console.log(selectedRows)
          this.selectedRowKeys=selectedRowKeys
          this.selectedRows=selectedRows;
          console.log(this.selectedRows)
        },
        hideDefaultSelections: true,
        selections: [
          {
            key: 'odd',
            text: '选择未选信访件',
            onSelect: changableRowKeys => {
              let newSelectedRowKeys = [];
              newSelectedRowKeys = changableRowKeys.filter((key, index) => {
                if (this.dataSource[index].status !== 0) {
                  return false;
                }else{
                  console.log(this.dataSource[index])
                  this.selectedRows.push(this.dataSource[index])
                  console.log(this.selectedRows)
                  return true;
                }
              });
              this.selectedRowKeys = newSelectedRowKeys;
            },
          },
        ],
        onSelection: this.onSelection,
        selectedRowKeys:this.selectedRowKeys,
        // getCheckboxProps: record=>({
        //   props:{
        //     disabled:record.state==1
        //   }
        // })
      };
    },
  },
  methods:{
    selectNot(){
      console.log("ssssssss")
      for(let i=0;i<this.dataSource.length;i++){
        console.log(this.selectedRows)
        if(this.dataSource[i].status==0){
          this.selectedRowKeys.push(this.dataSource[i].xfjbh)
          this.selectedRows.push(this.dataSource[i])
        }
      }
    },
    selectAll(){
      for(let i=0;i<this.dataSource.length;i++){
        console.log(this.selectedRows)
        this.selectedRowKeys.push(this.dataSource[i].xfjbh)
        this.selectedRows.push(this.dataSource[i])
      }
    },
    handleDel(record,index){
      console.log(index)
      console.log(this.dataSource[index])
      this.dataSource.splice(index,1)
      console.log(this.dataSource)
    },
    cancel(){
      this.visible=false
    },
    sure(){
      this.updataQxKeyId()
      this.cancel()
    },
    open(item){
      this.selectedRows=[],
      this.selectedRowKeys=[],
      this.data=item
      console.log(item)
      console.log(this.data)
      this.visible=true
      this.loading=true
      this.selectQxCategoryXfj()
    },
    updataQxKeyId(){
      console.log(this.dataSource)
      console.log(this.data)
      this.data.sortXfjEntities=this.selectedRows
      EpaSortService.updataQxKeyId(this.data).then((res)=>{
        console.log(res)
        this.$emit('getCategoryStatistics');
      })
    },
    selectQxCategoryXfj(){
      EpaSortService.selectQxCategoryXfj(this.data).then((res)=>{
        console.log(res)
        this.dataSource=res.result
        this.item=res.result
      }).finally(
        ()=>{
          this.loading=false
        }
      )
    },
    handleTableChange(pagination){
      console.log(pagination)
      this.ipagination.current=pagination.current
      this.ipagination.pageSize=pagination.pageSize
      console.log(this.ipagination)
    },
  }
}
</script>

<style scoped>

</style>